import 'package:flutter/material.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';
import 'package:form_builder_extra_fields/form_builder_extra_fields.dart';
import 'package:prototype/theme/custom_theme.dart';

class VSearchableDropDown extends StatelessWidget {
  final String keyName;
  final List<dynamic> items;
  final String? labelText;
  final String? placeholder;
  final bool isRequired;
  final bool hasPaddingBottom;
  final FormFieldValidator? validators;

  const VSearchableDropDown({
    Key? key,
    required this.keyName,
    required this.items,
    this.labelText,
    this.isRequired = false,
    this.hasPaddingBottom = true,
    this.placeholder,
    this.validators,
  }) : super(key: key);

  @override
  Widget build(BuildContext context) {
    final _theme = CustomTheme.colorSchema;
    return Column(
      crossAxisAlignment: CrossAxisAlignment.start,
      children: [
        if (labelText != null)
          RichText(
            textHeightBehavior: const TextHeightBehavior(
              leadingDistribution: TextLeadingDistribution.even,
            ),
            text: TextSpan(
              children: [
                if (isRequired == true)
                  TextSpan(
                    text: '* ',
                    style: TextStyle(
                      color: Colors.red,
                      fontSize: 15.sp,
                    ),
                  ),
                TextSpan(
                  text: labelText!,
                  style: TextStyle(
                    fontSize: 15.sp,
                    height: 2.0,
                  ),
                ),
              ],
            ),
          ),
        FormBuilderSearchableDropdown(
          name: keyName,
          maxHeight: 300.h,
          popupBackgroundColor: _theme.tertiary,
          validator: validators,
          dropDownButton: Icon(
            Icons.arrow_drop_down,
            color: _theme.neutral,
          ),
          decoration: InputDecoration(
            contentPadding: const EdgeInsets.only(
              left: 10.0
            ),
            hintText: placeholder,
            hintStyle: TextStyle(
              fontSize: 12.sp,
              color: _theme.neutral,
            ),
            fillColor: _theme.tertiary,
            filled: true,
            border: InputBorder.none,
          ),
          items: items,
        ),
        if (hasPaddingBottom) SizedBox(height: 10.h)
      ],
    );
  }
}
